<template>
    <div>
        <vxe-tip status="primary">
            <pre>
    cascader: "shi",
    cascader: ['shi','qu'],
</pre>
        </vxe-tip>
        <y-form ref="formRef" :options="formOptions">

            <template #asdf>
                <svg-icon icon-class="user"></svg-icon>
            </template>
        </y-form>
    </div>
</template>

<script>


export default {
    data() {
        return {
            formOptions: {
                mounted() {
                },
                items: [
                    {
                        field: 'shen',
                        title: '省',
                        cascader: ['shi', 'qu'],
                        itemRender: {
                            name: 'ZSelect',
                            props: {
                                initData: async () => {
                                    return [
                                        { name: '四川省', value: '1' },
                                        { name: '青海省', value: '2' }
                                    ]
                                }
                            }
                        }
                    },
                    {
                        span: 20,
                        children: [
                            {
                                field: 'shi',
                                title: '市',
                                itemRender: {
                                    name: 'ZSelect',
                                    props: {
                                        initData: async (formData) => {
                                            const si = [
                                                { name: '成都', value: '1' },
                                                { name: '重庆', value: '2' }
                                            ]
                                            const qing = [
                                                { name: '安徽', value: '11' },
                                                { name: '北京', value: '22' },
                                            ]
                                            console.log(formData)
                                            if (formData.shen == '1') {
                                                return si
                                            } else if (formData.shen == '2') {
                                                return qing
                                            } else {
                                                return [

                                                ]
                                            }
                                        }
                                    }
                                }
                            },
                            {
                                field: 'qu',
                                title: '区',
                                itemRender: {
                                    name: 'ZSelect',
                                    props: {
                                        initData: async (formData) => {
                                            const si = [
                                                { name: '成都sssssssss', value: '1' },
                                                { name: '重庆sssssssss', value: '2' }
                                            ]
                                            const qing = [
                                                { name: '安徽sssssss', value: '1' },
                                                { name: '北京sssssss', value: '2' },
                                            ]
                                            if (formData.shen == '1') {
                                                return si
                                            } else if (formData.shen == '2') {
                                                return qing
                                            } else {
                                                return []
                                            }
                                        }
                                    }
                                }
                            }
                        ]
                    }
                ]
            }
        }
    },
    mounted() {
        this.$refs.formRef.setData({
            "shen": "1",
            "shi": "1",
            "qu": "1"
        })
    },
}
</script>

<style lang="scss" scoped></style>